<template>
	<view class="content">
		<view class="text">
			<u-loading-icon :show="loading"></u-loading-icon>
			<rich-text v-if="!loading" :nodes="text"></rich-text>
		</view>
		<view class="foot">
			<u-button shape="circle" type="primary" text="再来一条" @click="getWrit"></u-button>
			<u-button style="width: 50%;" shape="circle" type="info" text="复制" @click="copy"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				text:"",
				loading:false,
			}
		},
		onLoad() {
			this.getWrit()
		},
		methods: {
			tirem(msg) {
					var msg = msg.replace(/<\/?[^>]*>/g, ''); //去除HTML Tag
					msg = msg.replace(/[|]*\n/, ''); //去除行尾空格
					msg = msg.replace(/&npsp;/gi, ''); //去掉npsp
					return msg;
			},
			copy(){
				//uni.setClipboardData方法就是讲内容复制到粘贴板
				uni.setClipboardData({
					data: this.tirem(this.text),//要被复制的内容
					success:() => {//复制成功的回调函数
						uni.showToast({//提示
							title:'复制成功' 
						})
					}
				});
			},
			getWrit(){
				if (this.loading) {
					return false
				}
				this.loading = true
				let that = this
				uni.request({
					url: 'https://zj.v.api.aa1.cn/api/wenan-wy/?type=json',
					success: (res) => {
						console.log(res);
						if (res.statusCode==200) {
							this.loading = false
							this.text = res.data.msg || ""
						}else{
							this.getWritElse()
						}
					},
					complete(res) {
						if (res.errMsg=="request:fail") {
							uni.request({
								url: 'https://v.api.aa1.cn/api/api-wenan-wangyiyunreping/index.php?aa1=json',
								success: (res) => {
									if (res.statusCode==200) {
										that.loading = false
										that.text = res.data[0].wangyiyunreping || ""
									}
								},
							})
						}
					},
				})
			},
		}
	}
</script>

<style lang="less" scoped>
.content{
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-direction: column;
	padding: 20rpx;
	box-sizing: border-box;
	.text{
		flex: 1;
		background: #eee;
		padding: 30rpx;
		box-sizing: border-box;
		border-radius: 10rpx;
	}
	.foot{
		width: 100%;
		height: 100rpx;
		margin-top: 20rpx;
		display: flex;
		justify-content: space-between;
		/deep/ .u-button{
			width: 48% !important;
		}
	}
}
</style>
